<!DOCTYPE html>
<html lang="en">

	<head>
		<meta http-equiv="content-type" content="text/html; charset=UTF-8">
		<meta charset="utf-8">
		<title></title>
		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1, user-scalable=no">
		<meta name="description" content="">
		<meta name="author" content="">
		<!-- STYLESHEETS -->
		<!--[if lt IE 9]><script src="../../js/flot/excanvas.min.js"></script><script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script><script src="http://css3-mediaqueries-js.googlecode.com/svn/trunk/css3-mediaqueries.js"></script><![endif]-->
    <link rel="stylesheet" type="text/css" href="../../css/cloud-admin.css" >
	<link rel="stylesheet" type="text/css"  href="../../css/themes/default.css" id="skin-switcher" >
	<link rel="stylesheet" type="text/css"  href="../../css/responsive.css" >	
	<link href="../../font-awesome/css/font-awesome.min.css" rel="stylesheet">
	<!-- SELECT2 -->
	<link rel="stylesheet" type="text/css" href="../../js/select2/select2.min.css" />
	<!-- UNIFORM -->
	<link rel="stylesheet" type="text/css" href="../../js/uniform/css/uniform.default.min.css" />
	<!-- datatable -->
    <link rel="stylesheet" href="../../js/datatables/datatable.css">
    <link rel="stylesheet" href="../../js/datepicker/datepicker.css">
<style type="text/css">
.wd{width: 110px}
</style>
	</head>

	<body>
		<header class="navbar clearfix" id="header">
		</header>

		<!-- PAGE -->
		<section id="page">
			<!-- SIDEBAR -->
			<div id="sidebar" class="sidebar">
				<div class="sidebar-menu nav-collapse">

					<!-- SIDEBAR MENU -->
					<ul>
						
					</ul>
					<!-- /SIDEBAR MENU -->
				</div>

			</div>
			<!-- /SIDEBAR -->
			<div id="main-content">

				<div class="container">
					<div class="row">
						<div id="content" class="col-lg-12">
							<!-- PAGE HEADER-->
							<div class="row">
								<div class="col-sm-12">
									<div class="page-header">
										<!-- STYLER -->

										<!-- /STYLER -->
										<!-- BREADCRUMBS -->
										<ul class="breadcrumb">
											<li>
												<i class="fa fa-home"></i>
												<a href="index.html">首页</a>
											</li>
											<li>
												<a href="#">商品管理</a>
											</li>
											<li>维护商品</li>
										</ul>
										<!-- /BREADCRUMBS -->

									</div>
								</div>
							</div>
							<!-- /PAGE HEADER -->
							<!-- SAMPLE -->
							
							<div class="row col-md-12">
								
							<form id="form_weixin">
								<div class="form-group  mrg-bt10" >
									<label class="control-label col-md-3" style="line-height:34px;"><span class="required">*</span>模板类型：</label>
									<div class="col-md-5" style="display: inline-flex">
										<select id="messageType" name="wxMessageType" class="col-md-12 select2-offscreen">
										
										<option   value="BindIngMsg">绑定通知</option>
										<option   value="NewAction">参与活动即将开始提醒</option>
										<option   value="Promotion">促销通知（订阅消息）</option>
										<option   value="Custom">客服消息</option>
										</select>
									</div>
								</div>
								<div class="form-group  mrg-bt10" style="height: 180px">
									<label class="control-label col-md-3" style="line-height:34px;"><span class="required">*</span>内容：</label>
									<div class="col-md-7" style="display: inline-flex">
									<textarea class="form-control " style="width:450px" rows="7" cols="5" name="firstData" placeholder="您的优惠券即将到期"></textarea>
									
										
									</div>
								</div>
								
								<div id="div_content">
									<div class="form-group   mrg-bt10">
												<label class="control-label col-md-3"><span class="required">*</span>品牌名称：</label>
												<div class="col-md-7" style="text-align: left;display: inline-flex">
													<input type="text" class="form-control" style="width:450px" name="keyword1Data" value="壹果微信商城">										
												
												</div>
	
									</div>
									<div class="form-group  mrg-bt10">
												<label class="control-label col-md-3"><span class="required">*</span>服务类型：</label>
												<div class="col-md-7" style="text-align: left;display: inline-flex">
													<input type="text" class="form-control " style="width:450px" name="keyword2Data" value="优惠券" >										
												
												</div>
	
									</div>
									<div class="form-group  mrg-bt10">
												<label class="control-label col-md-3"><span class="required">*</span>到期时间：</label>
												<div class="col-md-7" style="text-align: left;display: inline-flex">
													<input type="text" class="form-control" style="width:450px" name="keyword3Data" value="以优惠券到期时间为准">										
												
												</div>
	
									</div>		
														
								
								</div>
								
								<div class="form-group  mrg-bt10 remark-div">
											<label class="control-label col-md-3"><span class="required">*</span>备注：</label>
											<div class="col-md-7" style="text-align: left;display: inline-flex">
												<input type="text" class="form-control" style="width:450px" name="remarkData" value="立即到官网查看">										
											
											</div>

								</div>
								<div class="form-group  mrg-bt10 linkUrl">
											<label class="control-label col-md-3"><span class="required">*</span>链接地址：</label>
											<div class="col-md-7" style="text-align: left;display: inline-flex">
												<input type="text" class="form-control" style="width:450px" name="linkUrl" value="http://m.yiigoo.com/mall/index.html?sourceCode=ygwxf170725">										
											
											</div>

								</div>
								<div class="form-group  mrg-bt10">
											<label class="control-label col-md-3"><span class="required">*</span>您的手机号：</label>
											<div class="col-md-6" style="text-align: left;display: inline-flex">
												<input type="text" class="form-control"  style="width:450px" name="userName" placeholder="请输入您的手机号进行预览">										
											
											</div>

								</div>
										
							</form>
							
								
								<div class="row" style="height: 30px;">
								<div class="col-md-10" style="text-align: center;">
								<div class="box " style="margin-left: -80px;color: red">
								  请先预览，预览没有问题再点 正式推送
								</div>
									<div class="box ">
										<a href="javascript:;" type="test"  class="btn btn-success bt-test" style="width: 100px;margin-top:20px;">
											预览
										</a>
										<a href="javascript:;" type="publish" class="btn btn-danger bt-publish" style="width: 100px;margin-top:20px;">
											正式推送
										</a>
									</div>
								</div>
					    </div>		
					    <!-- 订阅促销通知 -->
					    <div id="PromotionDiv" style="display:none">
								<div class="form-group   mrg-bt10">
											<label class="control-label col-md-3"><span class="required">*</span>消息标题：</label>
											<div class="col-md-7" style="text-align: left;display: inline-flex">
												<input type="text" class="form-control" style="width:450px" name="title" >										
											
											</div>

								</div>
								<div class="form-group  mrg-bt10">
											<label class="control-label col-md-3"><span class="required">*</span>订阅数量：</label>
											<div class="col-md-7" style="text-align: left;display: inline-flex">
												<input type="text" class="form-control" style="width:450px;" readonly=true name="quantity">										
											</div>

								</div>
					    </div>
					    		    <!-- 客服消息通知 -->
					    <div id="CustomDiv" style="display:none">
								
								<div class="form-group  mrg-bt10">
											<label class="control-label col-md-3"><span class="required">*</span>48小时内未下单用户数量：</label>
											<div class="col-md-7" style="text-align: left;display: inline-flex">
												<input type="text" class="form-control" style="width:450px;" readonly=true name="hourcount">										
											</div>

								</div>
					    </div>	
					    <div id="ProductServiceDiv" style="display:none">
					    
					    <div class="form-group  mrg-bt10">
											<label class="control-label col-md-3"><span class="required">*</span>品牌名称：</label>
											<div class="col-md-7" style="text-align: left;display: inline-flex">
												<input type="text" class="form-control"  style="width:450px" name="keyword1Data" >										
											
											</div>

								</div>
								<div class="form-group mrg-bt10">
											<label class="control-label col-md-3"><span class="required">*</span>服务类型：</label>
											<div class="col-md-7" style="text-align: left;display: inline-flex">
												<input type="text" class="form-control"  style="width:450px" name="keyword2Data" >										
											
											</div>

								</div>
								<div class="form-group mrg-bt10">
											<label class="control-label col-md-3"><span class="required">*</span>到期时间：</label>
											<div class="col-md-7" style="text-align: left;display: inline-flex">
												<input type="text" class="form-control"  style="width:450px" name="keyword3Data" >										
											
											</div>

								</div>
					    </div>	
					    
					     <div id="NewActionDiv" style="display:none">
					    
					    <div class="form-group mrg-bt10">
											<label class="control-label col-md-3"><span class="required">*</span>用户名：</label>
											<div class="col-md-7" style="text-align: left;display: inline-flex">
												<input type="text" class="form-control"  style="width:450px" name="keyword1Data" value="不用填写系统自动获取用户的手机号" >										
											
											</div>

								</div>
								<div class="form-group mrg-bt10">
											<label class="control-label col-md-3"><span class="required">*</span>主题：</label>
											<div class="col-md-7" style="text-align: left;display: inline-flex">
												<input type="text" class="form-control" style="width:450px" name="keyword2Data" >										
											
											</div>

								</div>
								<div class="form-group mrg-bt10">
											<label class="control-label col-md-3"><span class="required">*</span>时间：</label>
											<div class="col-md-7" style="text-align: left;display: inline-flex">
												<input type="text" class="form-control" style="width:450px" name="keyword3Data" >										
											
											</div>

								</div>
								<div class="form-group  mrg-bt10">
											<label class="control-label col-md-3"><span class="required">*</span>地点：</label>
											<div class="col-md-7" style="text-align: left;display: inline-flex">
												<input type="text" class="form-control" style="width:450px" name="keyword4Data" value="壹果微信商城" >										
											
											</div>

								</div>
							
					    </div>	
					    
					     <div id="BindIngMsgDiv" style="display:none">
					    
					          <div class="form-group  mrg-bt10">
											<label class="control-label col-md-3"><span class="required">*</span>帐号：</label>
											<div class="col-md-7" style="text-align: left;display: inline-flex">
												<input type="text" class="form-control" style="width:450px" name="keyword1Data" value="不用填写系统自动获取用户的手机号" >										
											
											</div>

								</div>
								<div class="form-group mrg-bt10">
											<label class="control-label col-md-3"><span class="required">*</span>备注：</label>
											<div class="col-md-7" style="text-align: left;display: inline-flex">
												<input type="text" class="form-control " style="width:450px" name="keyword2Data" >										
											
											</div>

								</div>
					    </div>	
					    
						
							<!-- /SAMPLE -->

							<div class="footer-tools">
								<span class="go-top">
								<i class="fa fa-chevron-up"></i> Top
							</span>
							</div>
						</div>
						<!-- /CONTENT-->
					</div>
				</div>
			</div>
		</section>
		<!--/PAGE -->
		<!-- JAVASCRIPTS -->
		<!-- Placed at the end of the document so the pages load faster -->

		<script src="../../js/jquery/jquery-2.0.3.min.js"></script>
	
	<!-- BOOTSTRAP -->
	<script src="../../bootstrap-dist/js/bootstrap.min.js"></script>
	<!-- BLOCK UI -->
	<script type="text/javascript" src="../../js/jQuery-BlockUI/jquery.blockUI.min.js"></script>
	
	<!-- AUTOSIZE -->
	<script type="text/javascript" src="../../js/autosize/jquery.autosize.min.js"></script>
	<!-- spinner -->
		<script src="../../js/spinner/spin.js"></script>
	<!-- INPUT MASK -->
	<script type="text/javascript" src="../../js/bootstrap-inputmask/bootstrap-inputmask.min.js"></script>
   	    <!--bootbox-->
	<script type="text/javascript" src="../../js/bootbox/bootbox.min.js"></script>
	<!-- SELECT2 -->
	<script type="text/javascript" src="../../js/select2/select2.min.js"></script>
	
	<!-- UNIFORM -->
	<script type="text/javascript" src="../../js/uniform/jquery.uniform.min.js"></script>
		<script type="text/javascript" src="../../js/datepicker/datepicker.js"></script>
		  <script src="../../js/jquery-validate/jquery.validate.min.js"></script>
	<!-- COOKIE -->
	<script type="text/javascript" src="../../js/jQuery-Cookie/jquery.cookie.min.js"></script>
	<!-- CUSTOM SCRIPT -->
	<script src="../../js/script.js"></script>
	
     <script src="../../js/common.js"></script>
		<script>
		
		var weixin=function(){
			var valiFrom=$("#form_weixin");
			 
			var formValiInit=function(rules){
	            valiFrom.validate({
	                doNotHideMessage: true,
					errorClass: 'error-span wd',
	                errorElement: 'span',
	                rules: rules,
	                highlight: function (element) { 
	                    $(element).closest('.form-group').removeClass('has-success').addClass('has-error'); 
	                },
	
	                unhighlight: function (element) { 
	                    $(element).closest('.form-group').removeClass('has-error'); 
	                },	
	                success: function (label) {
	                   label.addClass('valid').closest('.form-group').removeClass('has-error').addClass('has-success'); 
	                    }
	               
				 });
			};
			var doSend = function(){
				var type=$(this).attr("type");
				var msgType = $('[name=wxMessageType]').val();
				if(msgType=='Promotion'){
					confirmSubscribeMsg(type);
				}else if(msgType=='Custom'){
					sendCustomMessage();
				}else{
					saveWeixin(type);
				}
				
				
			}
	        var saveWeixin=function(type){
	        	//var type=$(this).attr("type");
	        	var formJson=$("#form_weixin").serializeObject();
	        	if(valiFrom.valid() == false)return false;	        
	        	if(type=="publish"){
	        			$.confirm("确定将模板消息立即发送给所有用户?",function(){
	        				formJson.userName="";
	        				$.blockUI();
	        				sendMsg(formJson,type);
	        			});
	        		}else{
	        			if(formJson.userName==""){
	        				$.alert("请输入手机号进行预览");
	        				return false;
	        			}
	        			sendMsg(formJson,type);
	        		}
	        
	        };
	        var bindClickPublish = function(){
	        	var dis = $(".bt-publish").attr("disabled");
	        	if("disabled" ==dis ){
					$(".bt-publish").removeAttr("disabled");
	        		$(".bt-publish").click(doSend);
	        	}
	        	
	        }
	        var offClickPublish = function(){
	       	 $(".bt-publish").off("click");
			 $(".bt-publish").attr("disabled","disabled");
	        }
	        var sendMsg=function(formJson,type){	        	
	        	   $.ajax({
						type: "post",
						url: App.getContextPath()+"admin/weixin/sendWeixinMessage.do",
						async: true,
						data: $.param({weixinMessage:JSON.stringify(formJson),userName:formJson.userName}),
						success: function(result) {
							if(type=="test"&&result.type=="success"){
								bindClickPublish();
							
								 $.alert("发送成功,请到手机上确认");
							}
							if(type=="publish"&&result.type=="success"){
								 $.alert("发送成功");
								 offClickPublish();
								 $.unblockUI();
							}else{
								$.alert(result.content);
							}
					     }
					   });
	        }
	        
	        
	        var confirmSubscribeMsg=function(type){
	        	
	        	if(valiFrom.valid() == false)return false;	    
	        	
	        	var subscribeType = $("[name=wxMessageType]").val();
	        	var linkUrl = $("[name=linkUrl]").val();
	        	var userName = $("[name=userName]").val();
	        	var content = $("[name=firstData]").val();
	        	var title = $("[name=title]").val();
	        	if(type=="publish"){
	        			$.confirm("确定将订阅消息立即发送给所有订阅用户?",function(){
	        				$.blockUI();
	        				sendSubscribeMsg(subscribeType,linkUrl,content,title,null);
	        			});
	        		}else{
	        			if(userName==""){
	        				$.alert("请输入手机号进行预览");
	        				return false;
	        			}
	        			sendSubscribeMsg(subscribeType,linkUrl,content,title,userName);
	        		}
	        
	        };
	        var sendSubscribeMsg=function(subscribeType,linkUrl,content,title,userName){	        	
	        	   $.ajax({
						type: "post",
						url: App.getContextPath()+"admin/subscribemsg/sendSubscribeMsg.do",
						async: true,
						data: {
							subscribeType:subscribeType,url:linkUrl,content:content,userName:userName,title:title
						},
						success: function(result) {
							if(userName != null &&result.type=="success"){
								bindClickPublish();
								 $.alert("发送成功,请到手机上确认");
							}
							if(userName == null &&result.type=="success"){
								 $.alert("发送成功");
								 offClickPublish();
								 $.unblockUI();
							}else{
								$.alert(result.content);
							}
					     }
					   });
	        }
	    	var subscribeCount =function(type){
				var subscribeType = $("[name=subscribeType]").val();
				  $.ajax({
						type: "post",
						url: App.getContextPath()+"admin/subscribemsg/findCountByType.do",
						async: true,
						data: {
							subscribeType:type
						},
						success: function(result) {
							if(result.type=="success"){
								 $("[name=quantity]").val(result.extra);
								
							}else{
								$.alert(result.content);
							}
					     }
					   });
			}
			//获取48小时内未下单的点击菜单的用户
	    	var getPre48HourCount =function(type){
				
				  $.ajax({
						type: "post",
						url: App.getContextPath()+"admin/weixin/getPre48HourCount.do",
						async: true,
						data: {},
						success: function(result) {							
								 $("[name=hourcount]").val(result);
														
					     }
					   });
			}
			var sendCustomMessage=function(){
				var content = $("[name=firstData]").val();
				var userName = $("[name=userName]").val();
				$.ajax({
					type: "post",
					url: App.getContextPath()+"admin/weixin/sendUserByPre48Hour.do",
					async: true,
					data: {
						userName:userName,content:content
					},
					success: function(result) {
						if(userName != null &&result.type=="success"){
							$("[name=userName]").val('');
							bindClickPublish();
							 $.alert("发送成功,请到手机上确认");
						}
						if(userName == null &&result.type=="success"){
							 $.alert("发送成功");
							 offClickPublish();
							 $.unblockUI();
						}else{
							$.alert(result.content);
						}
				     }
				   });
			}
	    	var messageTypeChange = function(){
 				msgType = $(this).attr('msg-type');
 				offClickPublish();
				$(".linkUrl").show();
			    var id=$(this).val()+"Div";	
			    
			    if($(this).val() =='Promotion'){
			    	$(".remark-div").hide();
			    	
			    	subscribeCount($(this).val());
			    }
			    if($(this).val() =='Custom'){
			    	$(".remark-div").hide();
			    	$(".linkUrl").hide();
			    	getPre48HourCount($(this).val());
			    }
				$("#div_content").empty().append($("#"+id).html());
				
				//formValiInit(rules);						
				$("textarea").val("");
	    		
	    	}
	         return {	         
		         init:function(){	
		        	 var rules={                	 
			                	firstData:{required:true},
			                	keyword1Data:{required:true},
			                	keyword2Data:{required:true},
			                	keyword3Data:{required:true},
			                	keyword4Data:{required:true},
			                	linkUrl:{required:true},
			                	title:{required:true},
			                	remarkData:{required:true}
			                	
			                };
		        	 
					$("#messageType").select2();
					$("#messageType").change(messageTypeChange )
					
					formValiInit(rules);
					$(".bt-publish").attr("disabled","disabled");
				
					 $(".bt-test").unbind("click").click(doSend);
		          }
	         }
		    
	      }();
	      
	      $(function(){
	      	$("#header").load("../head.html");
	        App.init(); //Initialise plugins and elements	        
	        weixin.init();
	      	
	      });
		</script>
	

		<!-- /JAVASCRIPTS -->
	</body>

</html>